<template>
  <base-breadcrumb>
    <a-card :bordered="false">
      <title-name title="查看设计成果资料" />

      <a-row :gutter="24">
        <a-col
          :md="8"
          :sm="8"
        >
          <a-form-item
            label="分公司"
            :label-col="{ lg: { span: 7 }, sm: { span: 7 } }"
            :wrapper-col="{ lg: { span: 17 }, sm: { span: 17 } }"
          >
            <BaseInput
              v-model="dels.branchCompanyName"
              disabled
            />
          </a-form-item>
        </a-col>
        <a-col
          :md="8"
          :sm="8"
        >
          <a-form-item
            label="项目名称"
            :label-col="{ lg: { span: 7 }, sm: { span: 7 } }"
            :wrapper-col="{ lg: { span: 17 }, sm: { span: 17 } }"
          >
            <BaseInput
              v-model="dels.projectName"
              disabled
            />
          </a-form-item>
        </a-col>
        <a-col
          :md="8"
          :sm="8"
        >
          <a-form-item
            label="设计成果资源名称"
            :label-col="{ lg: { span: 7 }, sm: { span: 7 } }"
            :wrapper-col="{ lg: { span: 17 }, sm: { span: 17 } }"
          >
            <BaseInput
              v-model="dels.name"
              disabled
            />
          </a-form-item>
        </a-col>
      </a-row>
      <a-row :gutter="24">
        <a-col
          :md="8"
          :sm="8"
        >
          <a-form-item
            label="资料类型"
            :label-col="{ lg: { span: 7 }, sm: { span: 7 } }"
            :wrapper-col="{ lg: { span: 17 }, sm: { span: 17 } }"
          >
            <BaseInput
              v-model="dels.typeDataName"
              disabled
            />
          </a-form-item>
        </a-col>
        <a-col
          :md="8"
          :sm="8"
        >
          <a-form-item
            label="版本"
            :label-col="{ lg: { span: 7 }, sm: { span: 7 } }"
            :wrapper-col="{ lg: { span: 17 }, sm: { span: 17 } }"
          >
            <BaseInput
              v-model="dels.exteriorVersion"
              disabled
            />
          </a-form-item>
        </a-col>
        <a-col
          :md="8"
          :sm="8"
        >
          <a-form-item
            label="出图日期"
            :label-col="{ lg: { span: 7 }, sm: { span: 7 } }"
            :wrapper-col="{ lg: { span: 17 }, sm: { span: 17 } }"
          >
            <BaseInput
              v-model="dels.pubDate"
              disabled
            />
          </a-form-item>
        </a-col>
      </a-row>
      <a-row :gutter="24">
        <a-col
          :md="8"
          :sm="8"
        >
          <a-form-item
            label="签收日期"
            :label-col="{ lg: { span: 7 }, sm: { span: 7 } }"
            :wrapper-col="{ lg: { span: 17 }, sm: { span: 17 } }"
          >
            <BaseInput
              v-model="dels.receiptDate"
              disabled
            />
          </a-form-item>
        </a-col>
        <a-col
          :md="8"
          :sm="8"
        >
          <a-form-item
            label="创建人"
            :label-col="{ lg: { span: 7 }, sm: { span: 7 } }"
            :wrapper-col="{ lg: { span: 17 }, sm: { span: 17 } }"
          >
            <BaseInput
              v-model="dels.creatorName"
              disabled
            />
          </a-form-item>
        </a-col>
        <a-col
          :md="8"
          :sm="8"
        >
          <a-form-item
            label="创建时间"
            :label-col="{ lg: { span: 7 }, sm: { span: 7 } }"
            :wrapper-col="{ lg: { span: 17 }, sm: { span: 17 } }"
          >
            <BaseInput
              v-model="dels.createTime"
              disabled
            />
          </a-form-item>
        </a-col>
      </a-row>
      <a-row :gutter="24">
        <a-col
          :md="8"
          :sm="8"
        >
          <a-form-item
            label="资料内容描述"
            :label-col="{ lg: { span: 7 }, sm: { span: 7 } }"
            :wrapper-col="{ lg: { span: 17 }, sm: { span: 17 } }"
          >
            <BaseInput
              v-model="dels.contentDescription"
              disabled
            />
          </a-form-item>
        </a-col>
      </a-row>
    </a-card>

    <a-card style="margin-top: 20px">
      <title-name title="设计成果资料" />

      <a-table
        bordered
        :pagination="false"
        :columns="columns"
        :data-source="dels.fileList"
      >
        <span
          slot="serial"
          slot-scope="text, record, index"
        >{{ index + 1 }}</span>
        <span
          slot="action"
          slot-scope="text, record, index"
        >
          <a
            :href="'/api/ycloud-file-center/oper/download?access_token='+token+'&fileId='+record.fileId"
            target="_parent"
          >导出</a>
          <a-divider
                  type="vertical"
          />
          <a
                  href="javascript:"
                  @click="$filePreview(record)"
          >预览</a>
        </span>
      </a-table>
    </a-card>

    <div class="page-btn-right-top">
    <!-- <div style="float:right;margin-top: 20px;margin-bottom: 20px;"> -->
      <a-button
        type="primary"
        @click="goBack"
      >
        关闭
      </a-button>
    </div>
  </base-breadcrumb>
</template>

<script>
  import Vue from 'vue'
  import { STable, Ellipsis } from '@/components'
  import { getExteriorOne  } from '@/api/design/designRegister'

  import ARow from 'ant-design-vue/es/grid/Row'


  const columns = [
    {
      title: '序号',
      dataIndex: 'serial',
      width: '5%',
      scopedSlots: { customRender: 'serial' },
    },
    {
      title: '附件名称',
      dataIndex: 'fileName',
      width: '35%',
    },
    {
      title: '附件格式',
      dataIndex: 'suffixName',
      width: '35%',
    },
    {
      title: '操作',
      key: 'action',
      width: '20%',
      scopedSlots: { customRender: 'action' },
    }


  ]
  export default {
    name:'a'+Date.now(),
    components: {
      ARow,
    },
    data() {
      this.columns = columns
      return {
        token:'',
        data:[],
        totalDels:{},
        queryParams:{
          id:'',
          assessmentTime:''
        },
        dels:{},
        id:'',
      }
    },

    created() {
      this.id = this.$route.query.id
      this.queryParams.id = this.$route.query.id
      this.token = Vue.getAcloudProvider().getAccessToken()
      this.getExteriorOne()
    },
    computed: {

    },
    methods: {
      getExteriorOne(){
        getExteriorOne({id:this.id}).then(res=>{
          this.dels = res.data
        })
      },
      goBack(){   // 关闭
        this.$multiTab.close(this.$route.fullpath)
      },
      
    }
  }
</script>


